<?php
global $mySession;
?>
<link href="<?= CSS_URL ?>style2.css" rel="stylesheet">
<style type="text/css">
    .dataTables_wrapper{
        float:left;
        margin-top:100px;
        width:100%;
    }
    #map_canvas
    {
        width:100%;height:300px;border: solid 1px #cccccc;	
        margin-left:15px;
    }
    .check_bx .checkbox_block
    {
        width:50%;
        float:left;
    }
    .check_bx .checkbox_block > input
    {
        float:left;
    }

    .check_bx .checkbox_block > label
    {
        float:left;
    }

    .rental_rate_blck label {
        color: #FFFFFF;
        font-size: 13px;
        font-weight: bold;
        padding-left: 131px;
        padding-top: 30px;
    }


    .extras_blck label[title="from"] {
        color: #FFFFFF;
        padding-left: 103px;
    }
    .extras_blck label {
        color: #FFFFFF;
        font-size: 13px;
        font-weight: bold;
        padding-left: 135px;
        padding-top: 30px;
    }
</style>
<script>
    var SITEURL = "<?= APPLICATION_URL; ?>";
    var PPTY_ID = "<?= $this->pptyId ?>";
    var dataArray = [];
</script>
<?
if ($this->step == '3') {
    ?>
    <script type="text/javascript" src="<?= JS_URL ?>main.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>
    <?
}
?>
<link href="<?= CSS_URL ?>style.css" rel="stylesheet">
<script type="text/javascript">
    $(document).ready(function(e) {

        $("#check_in").datepicker({
            maxDate: new Date(),
            dateFormat: "dd/mm/yy"
        });

        jQuery.validator.addMethod("validUrl", function(value, element) {
            return this.optional(element) || /^(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);
        }, "Please Enter Valid URL");

        $("#mws-ui-button-radio").buttonset();
    });

    function do_save_cal()
    {

        if ($("#mws-validate").valid())
        {
            $.ajax({
                type: 'POST',
                url: '<?= APPLICATION_URL_ADMIN ?>property/savecalendarstat/pptyId/<?= $this->pptyId ?>',
                async: false,
                data: ({Datef: $("#date_from").val(), Datet: $("#date_to").val(), Status: $("#status").val()}),
                success: function(data) {
                    //alert(data);
                    window.location = window.location.href;

                }

            });

        }
        return false;
    }

    //upload image code ends	
    //currency function
    function setcurrency()
    {
        if ($("#currency").val() != "")
        {

            $.ajax({
                type: 'POST',
                url: '<?= APPLICATION_URL_ADMIN ?>property/setcurrency/pptyId/<?= $this->pptyId ?>',
                async: false,
                data: ({Value: $("#currency").val()}),
                success: function(data) {
                    data = $.trim(data);
                    window.location = window.location.href;

                }
            });
        }

    }

</script>
<!-- scripts for rental rates-->
<script type="text/javascript">
    function checkvalid(id)
    {
        var error_flag = 0;
        $("#error_discount_offer" + id).hide();
        $("#error_valid_from" + id).hide();
        $("#error_valid_to" + id).hide();
        $("#error_min_stay" + id).hide();
        $("#error_bookby" + id).hide();

        if ($("#discount_offer" + id).length > 0)
        {
            if (isNaN($('#discount_offer' + id).val()) || $('#discount_offer' + id).val() == "" || $('#discount_offer' + id).val() == null || $("#discount_offer" + id).val().length > 3)
            {
                $("#error_discount_offer" + id).show();
                error_flag = 1;
            }
        }

        if ($("#valid_from" + id).val() == "" || $("#valid_from" + id).val() == null)
        {
            $("#error_valid_from" + id).show();
            error_flag = 1;
        }

        if ($("#valid_to" + id).val() == "" || $("#valid_to" + id).val() == null)
        {
            $("#error_valid_to" + id).show();
            error_flag = 1;
        }

        if ($("#min_stay" + id).length > 0)
        {
            if (isNaN($("#min_stay" + id).val()) || $("#min_stay" + id).val() == "" || $("#min_stay" + id).val() == null || $("#min_stay" + id).val().length > 3)
            {
                $("#error_min_stay" + id).show();
                error_flag = 1;
            }
        }

        if ($("#bookby" + id).val() == "" || $("#bookby" + id).val() == null)
        {
            $("#error_bookby" + id).show();
            error_flag = 1;
        }



        if (error_flag == 0)
            $.ajax({
                url: "<?= APPLICATION_URL_ADMIN ?>updater/saveoffers/pptyId/<?= $this->pptyId ?>",
                type: "POST",
                data: ({Valid_f: $("#valid_from" + id).val(), Valid_t: $("#valid_to" + id).val(), Nights: $("#min_stay" + id).val(), Discount: $("#discount_offer" + id).val(), Book_by: $("#bookby" + id).val(), offer_id: $("#offer_id" + id).val(),Spcl_offer_id: $("#spcl_offer_id" + id).val(),max_nights:$('#max_nights'+id).val()}),
                async: false,
                success: function(data) {
                    location.reload();
                }


            });

    }

    function dactive(id)
    {
        var c = confirm("Are you sure you want to de-activate this offer");
        if (c)
        {
            $.ajax({
                url: "<?= APPLICATION_URL_ADMIN ?>property/deactivateoffers/id/" + $("#spcl_offer_id" + id).val(),
                type: "GET",
                async: false,
                success: function(data) {
                    data = $.trim(data);
                    window.location.href = "<?= APPLICATION_URL_ADMIN ?>property/editproperty/pptyId/<?= $this->pptyId ?>/step/6";
                }


            });
        }
    }

    function mindate(value, id)
    {
        var fmtDate = value.split("/");
        if(fmtDate.length < 2)
            var fmtDate = value.split("-");
        var selectedDate = new Date(fmtDate[2], fmtDate[1]-1, fmtDate[0]);
        var msecsInADay = 86400000;
        var endDate = new Date(selectedDate.getTime()+msecsInADay);
        $("#"+id).datepicker( "option", "minDate", endDate );
    }
    function mindateforbook(value, id)
    {
        var fmtDate = value.split("/");
        if(fmtDate.length < 2)
            var fmtDate = value.split("-");
        var selectedDate = new Date(fmtDate[2], fmtDate[1]-1, fmtDate[0]);
        var msecsInADay = 86400000;
        var endDate = new Date(selectedDate.getTime()-msecsInADay);
        $("#"+id).datepicker( "option", "maxDate", endDate );
    }

    function do_save_ppty() //function for saving rental rates
    {
        var flag = 0;
        if ($("#mws-validate1").valid())
        {
            var Data = 0;
            $('#rate_blck').html("<div align = 'center' style='width:100%;'><img src = '<?= IMAGES_URL ?>black-001-loading.gif' width = '20' height = '20'></div>");
            $.ajax({
                url: "<?= APPLICATION_URL_ADMIN ?>updater/setrates/pptyId/<?= $this->pptyId ?>",
                type: "POST",
                data: ({Date_f: $("#date_from").val(), Date_t: $("#date_to").val(), Nights: $("#nights").val(), Rate: $("#rate").val(), Option: $('.rateOption:checked').val()}),
                async: false,
                success: function(data) {

                    data = $.trim(data);
                    flag = 1;
                    do_ppty();
                }
            })
            return false;
        }

        if (flag == 1)
            do_ppty();
    }

    function do_ppty() //function for displaying rental rates
    {
        var Data = 0;
        $('#rate_blck').html("<div align = 'center' style= 'clear:both;width:100%;'><img src = '<?= IMAGES_URL ?>black-001-loading.gif' width = '20' height = '20'></div>");

        $.ajax({
            url: "<?= APPLICATION_URL_ADMIN ?>updater/getrates/pptyId/<?= $this->pptyId ?>",
            type: "GET",
            async: false,
            success: function(data) {

                data = $.trim(data);
                $("#rate_blck").text("");

                if (data != '0' && data != "" && data != null)
                {
                    var ArrData = data.split("|");
                    if (ArrData.length > 0)
                    {
                        for (var i = 0; i < ArrData.length; i++)
                        {
                            var mySplit = ArrData[i].split(",");
                            var OptionValue1 = mySplit[0];
                            var OptionValue2 = mySplit[1];
                            var OptionValue3 = mySplit[2];
                            var OptionValue4 = mySplit[3];
                            var OptionValue5 = mySplit[4];
                            $("#rate_blck").append("<div style='width:100%;float:left;'><div style='width:20%' align = 'center'><label>" + OptionValue1 + "</label></div><div style='width:20%;' align = 'center'><label >" + OptionValue2 + "</label></div><div style='width:30%;' align='center'><label>" + OptionValue3 + "</label></div><div style='width:23%;' align='center'><label>" + OptionValue4 + "</label></div><div onclick = 'modifyrate(" + i + ",&quot;" + OptionValue5 + "&quot;,&quot;" + OptionValue1 + "&quot;,&quot;" + OptionValue2 + "&quot;,&quot;" + OptionValue3 + "&quot;,&quot;" + OptionValue4 + "&quot;);' style = 'cursor:pointer'><img class='deletes' src='<?= IMAGES_URL ?>application_form_edit.png' width = '20' height = '20'></div><div onclick = 'deleterate(" + OptionValue5 + ");' style = 'cursor:pointer'><img class='deletes' src='<?= IMAGES_URL ?>delete.png' width = '20' height = '20'></div></div>");

                            if (i + 1 == ArrData.length)
                                $("#cal_date").val(OptionValue2);

                        }


                    }


                }
                else
                {
                    $("#rate_blck").html("<div align='center' style = 'color:red;width:100%;'>No Items to display</div>");
                    $("#cal_date").val("");
                }
            }

        })

        return false;
    }


    function ratetocheck(ptr)
    {
        var rateto = ptr.value.split("")
        $("#rateFrom").datepicker("option", "maxDate", new Date(ptr.value));
    }

    function ratefromcheck(ptr)
    {
        var rateto = ptr.value.split("")
        $("#rateTo").datepicker("option", "minDate", new Date(ptr.value));
    }

    function modifyrate(i, id, from, to, night, rate)
    {
        var MIN_NIGHTS = "<select id = 'minNights'>";

        for (var j = 7; j <= 14; j++)
        {
            if (j == night)
            {
                var selected = 'selected="selected"'
            }
            else
            {
                var selected = '';
            }
            MIN_NIGHTS += "<option " + selected + ">" + j + "</option>";

        }
        MIN_NIGHTS += "</select>";

        $('#rate_blck').children("div :eq(" + i + ")").html("<div style='width:100%;float:left;margin-top:10px;' ><div style='width:20%' align = 'center'><label>" + from + "</label></div><div style='width:20%;' align = 'center'><label >" + to + "</label></div><div style='width:30%;' align='center'><label>" + MIN_NIGHTS + "</label></div><div style='width:23%;' align='center'><label><input type='text' id = 'rentalRate' value = '" + rate + "'></label></div><div onclick = 'updaterate(" + id + "," + from + "," + to + "," + night + "," + rate + ");' style = 'cursor:pointer'><img class='deletes' src='<?= IMAGES_URL ?>accept.png' width = '20' height = '20'></div><div onclick = 'do_ppty();' style = 'cursor:pointer'><img class='deletes'  src='<?= IMAGES_URL ?>cancel.png' width = '20' height = '20'></div></div>");


        var ratefrom = $("#rateFrom").val();
        ratefrom = ratefrom.split("-");

        var rateto = $("#rateTo").val();
        rateto = rateto.split("-");


        $("#rateFrom").datepicker({minDate: new Date(ratefrom[2], ratefrom[1] - 1, ratefrom[0]),
            maxDate: new Date(rateto[2], rateto[1] - 1, rateto[0])
        });

        $("#rateTo").datepicker({minDate: new Date(ratefrom[2], ratefrom[1] - 1, ratefrom[0]),
            maxDate: new Date(rateto[2], rateto[1] - 1, rateto[0])
        });


    }
    function extras_show() //function for showing extras
    {
        var Data = 0;
        $('#extra_blck').html("<div align = 'center' style= 'clear:both;width:100%;'><img src = '<?= IMAGES_URL ?>black-001-loading.gif' width = '20' height = '20'></div>");
        $.ajax({
            url: "<?= APPLICATION_URL_ADMIN ?>updater/getextras/pptyId/<?= $this->pptyId ?>",
            type: "GET",
            async: false,
            success: function(data) {

                data = $.trim(data);
                $("#extra_blck").text("");
                if (data)
                {
                    var ArrData = data.split("|");
                    if (ArrData.length > 0)
                    {
                        var htmlText = "";
                        for (var i = 0; i < ArrData.length; i++)
                        {
                            var mySplit = ArrData[i].split(",");
                            var OptionValue1 = mySplit[0];
                            var OptionValue2 = mySplit[1];
                            var OptionValue3 = mySplit[2];
                            var OptionValue4 = mySplit[3];
                            var OptionValue5 = mySplit[4];

                            if (OptionValue3 == 1)
                                OptionValue3 = "Compulsory";
                            else
                                OptionValue3 = "Optional";


                            if (OptionValue5 == 0)
                                OptionValue5 = "Night";
                            else
                                OptionValue5 = "Stay";

                            htmlText += "<div class ='inExtra' style='width:100%;float:left;'>";
                            htmlText += "<div style='width:33%' align = 'center'>";
                            htmlText += "<label>" + OptionValue1 + "</label>";
                            htmlText += "</div>";
                            htmlText += "<div style='width:20%;' align = 'center'>";
                            htmlText += "<label >" + OptionValue2 + "</label>";
                            htmlText += "</div>";
                            htmlText += "<div style='width:20%;' align='center'>";
                            htmlText += "<label>" + OptionValue3 + "</label>";
                            htmlText += "</div>";
                            htmlText += "<div style='width:20%;' align='center'>";
                            htmlText += "<label>" + OptionValue5 + "</label>";
                            htmlText += "</div>";
                            htmlText += "<a href = '#' style = 'display:block;'><div onclick = 'deleteextras(" + OptionValue4 + ");' ><img class='deletes' src='<?= IMAGES_URL ?>TRASH - EMPTY.png' width = '20' height = '20'></div></a>";
                            htmlText += "</div>";

                        }
                        $("#extra_blck").empty().append(htmlText);
//                        $("#extra_blck").append(htmlText);
                    }
                }
            }

        })

        return false;

    }

    function do_save_extra() //function for saving extras
    {

        var Data = 0;
        $('#extra_blck').html("<div align = 'center' style='width:100%;'><img src = '<?= IMAGES_URL ?>black-001-loading.gif' width = '20' height = '20'></div>");
        if ($("#mws-validate2").valid())
        {
            $.ajax({
                url: "<?= APPLICATION_URL_ADMIN ?>updater/saveextras/pptyId/<?= $this->pptyId ?>",
                type: "POST",
                data: ({extra_name: $("#extra_name").val(), extra_price: $("#extra_price").val(), extra_type: $("#extra_type").val(),
                    stay_type: $("#stay_type").val(), Option: $('#extraOption:checked').val()}),
                async: false,
                success: function(data) {

                    data = $.trim(data);
                    extras_show();
                }

            });
//            window.location.href = window.location.href;

        }
        return false;

    }

    function deleteextras(id) //function for deleting extras
    {
        alert(id);
        var flag = 0;
        $.ajax({
            url: "<?= APPLICATION_URL_ADMIN ?>property/deleteextras/id/" + id,
            type: "GET",
            async: false,
            success: function(data) {
                data = $.trim(data);
                if (data != "")
                {
                    alert("Record Sucessfully deleted");
                    flag = 1;
                }
            }
        })

        if (flag == 1)
            extras_show();
    }

</script>
<script type="text/javascript">
    // script for rental rates
    $(document).ready(function(e) {
        //**** Following is the date code *****//
        //****        for rental rate     *****//	

        var today = new Date();
        var d = today.getDate();
        var m = today.getMonth();
        var y = today.getFullYear();

        $("#date_from").datepicker({
            minDate: today,
            maxDate: new Date(y + 2, m, d),
            dateFormat: "dd/mm/yy",
            onSelect: function(dateText) {
                dateText = dateText.split("/");
                var $sD = new Date(dateText[2], dateText[1] - 1, dateText[0]);
                $sD.setDate($sD.getDate() + 1);
                $("#date_to").datepicker('option', 'minDate', $sD);
            }
        });


        $("#date_to").datepicker({
            minDate: today,
            maxDate: new Date(y + 2, m, d),
            dateFormat: "dd/mm/yy"
        });



        jQuery.validator.addMethod("dateCheck", function(value, element) {

            var value1 = $("#date_from").val();
            var value2 = $("#date_to").val();


            var valu1 = value1.split("/");
            var valu2 = value2.split("/");

            value1 = new Date(valu1[2], valu1[1], valu1[0]);
            value2 = new Date(valu2[2], valu2[1], valu2[0]);



            return (value2 > value1);

        }, "Choose Proper Date");
        //**** Above is the date code *****//
        //****  for rental rate ends  *****//	

    });


    function cal_default(value)
    {
        var c = confirm("Are you sure you want to proceed??");

        if (c)
        {

            $.ajax({
                type: 'POST',
                url: '<?= APPLICATION_URL_ADMIN ?>property/setcaldefault/pptyId/<?= $this->pptyId ?>',
                async: false,
                data: ({Value: value}),
                success: function(data) {
                    data = $.trim(data);
                    window.location = window.location.href;

                }
            });
        }
        else
            window.location = window.location.href;

    }

    //sript for rental rate ends
</script>
<div>
    <div class="mws-panel grid_8">
        <div class="mws-panel-header"><span class="mws-i-24 i-check">Properties Filtered</span></div>
        <div class="mws-panel-body">
            <ul class="ppty-list-blck-wrap" style="white-space:nowrap;overflow:scroll;">
            <?php
                foreach($this->propertyList as $pptyVal){
            ?>  
                <li class="ppty-list-blck" href="<?=APPLICATION_URL_ADMIN?>dashboard#customer" style="position:relative;">
                    <span class="mws-report-value" style="font-size:16px;margin:0 auto;"><?=$pptyVal['propertycode'];?></span>
                </li>
            <?php
                }
            ?>
            </ul>
        </div>
    </div>
    <div class="mws-panel grid_8">
        <div class="mws-panel-header"><span class="mws-i-24 i-check">Rental Rates</span></div>
        <div class="mws-panel-body" >
            <fieldset id="step-4" class="mws-form-inline">

                <div style = "padding:20px;width:95%;"> <!-- wrapper div for step 7-->
                    <div style="height:auto;" class="mws-form"><!-- rental rate wrapper div-->
                        <form name="myform1" id="mws-validate1" method="post"  novalidate="novalidate" class="mws-form" >	
                            <h5>Property Daily Rental Rates Panel:</h5>
                            <div class="mws-form-row">
                                <label><input type="radio" name="rateOption" class="rateOption" value="overwrite" checked="checked"> Overwrite</label>
                                <label><input type="radio" name="rateOption" class="rateOption" value="add"> Add</label>
                            </div>
                            <div class="mws-form-col-2-8 alpha">
                                <label>Date From:</label>
                                <div class="mws-form-item large">
                                    <input <?= $disabled ?> type="text" name="date_from" id = "date_from" class="mws-textinput required date" title = "date from">
                                </div>
                            </div>
                            <div class="mws-form-col-2-8">
                                <label>Date To:</label>
                                <div class="mws-form-item large">
                                    <input <?= $disabled ?> type="text" name="date_to" id = "date_to" class="mws-textinput required date dateCheck" >
                                </div>
                            </div>
                            <div class="mws-form-col-2-8">
                                <label>Minimum Night Stay (Default is 7):</label>
                                <div class="mws-form-item large">
                                    <select <?= $disabled ?>  name="nights" id ="nights" class="mws-textinput required" >
                                        <?
                                        for ($i = 7; $i <= 14; $i++) {
                                            if ($i == 7)
                                                $selected = "selected = 'selected'";
                                            else
                                                $selected = "";
                                            echo "<option '" . $selected . "' value='" . $i . "'>" . $i . "</option>";
                                        }
                                        ?>
                                    </select>
                                </div>
                            </div>
                            <div class="mws-form-col-2-8 omega">
                                <label>Daily Rate</label>
                                <div class="mws-form-item large">
                                    <input <?= $disabled ?> class="mws-textinput required number" name="rate"  id = "rate" type="text">
                                </div>
                            </div>    

                            <div style = 'margin-left:700px;'>
                                <input <?= $disabled ?> type="button" value="Update" class="mws-tooltip-n mws-button blue"  onClick="do_save_ppty()" title="upload">
                            </div>

                        </form>
                        <input type="hidden" name="cal_date" id = "cal_date">
                        <div style='margin-bottom:55px;'>
                            <div class="rental_rate_blck">
                                <label title="from">From</label>
                                <label>To</label>
                                <label>Minimum Night stay</label>
                                <label>Daily Rate</label>

                            </div>

                            <div class="rental_rate_blck2" id = "rate_blck" style = 'display:inline-block;'>


                            </div>

                        </div>
                        <div style="margin-bottom:40px;">
                            <input type="checkbox" form="mws-validate" id="insurance" name="insurance" <?php echo $this->is_insured == '1' ? 'checked="checked"' : ''; ?> <?= $disabled ?> onclick="makepropertyinsurance()" > Is Property Home Insurance included in the Daily Rates?
                        </div>
                        <!-- extras panel starts -->
                        <h5>Extras:</h5>
                        <div class="mws-form-row">
                            <label><input type="radio" name="extraOption" id="extraOption" value="overwrite" checked="checked"> Overwrite</label>
                            <label><input type="radio" name="extraOption" id="extraOption" value="add"> Add</label>
                        </div>
                        <form name="myform2" id="mws-validate2" method="post"  novalidate="novalidate" class="mws-form" >	
                            <input type="hidden" name="step_revert" value="7" /> <!-- jugaad -->
                            <div class="mws-form-col-2-8 alpha">
                                <label>Name Of Extras:</label>
                                <div class="mws-form-item large">
                                    <input <?= $disabled ?> type="text" name="extra_name" id = "extra_name" class="mws-textinput required" maxLength = "50">
                                </div>
                            </div>
                            <div class="mws-form-col-2-8">
                                <label>Price:</label>
                                <div class="mws-form-item large">
                                    <input <?= $disabled ?> type="text" name="extra_price" id = "extra_price" class="mws-textinput required number" >
                                </div>
                            </div>
                            <div class="mws-form-col-2-8">
                                <label>Type:</label>
                                <div class="mws-form-item large">
                                    <select <?= $disabled ?> name="extra_type" id ="extra_type" class="mws-textinput required" >
                                        <option value="">- - Select - -</option>
                                        <option value="0">Optional</option>
                                        <option value="1">Compulsory</option>
                                    </select>
                                </div>
                            </div>

                            <div class="mws-form-col-2-8">
                                <label>Per:</label>
                                <div class="mws-form-item small">
                                    <select <?= $disabled ?> name="stay_type" id ="stay_type" class="mws-textinput required" >
                                        <option value="">- - Select - -</option>
                                        <option value="0">Night</option>
                                        <option value="1">Stay</option>
                                    </select>
                                </div>
                            </div>
                            <br />

                            <div class="mws-button-row1" style="border:none;margin-left:706px;">
                                <input <?= $disabled ?> type="button" value="Update" class="mws-tooltip-n mws-button blue" onClick="do_save_extra()">
                            </div>
                        </form>    

                        <div style="margin-bottom:55px;"><!-- display block of extras-->
                            <div class="extras_blck">
                                <label title="from">Name Of Extras</label>
                                <label>Price</label>
                                <label>Type</label>
                                <label>Per</label>
                            </div>

                            <div class="extras_blck2" id = "extra_blck" style = 'display:inline-block;'></div>

                        </div>

                        <!-- Special Offers tab starts -->
                        <h5>Special offers:</h5>
                        <div id="layout" class="mw-form-inline">
                            <br>
                            <div id="layout">
                                <div class="hgroupheader">
                                    <div class="cell spcl1" align="center">Special Offer Type</div>
                                    <div class="cell spcl2" align="center">Promo Code</div>
                                    <div class="cell spcl2" align="center">Valid From (Arrive after)</div>
                                    <div class="cell spcl2" align="center">Valid Until (Leave by)</div>
                                    <div class="cell spcl3" align="center">Minimum Night Stay</div>
                                    <div class="cell spcl4" align="center">Discount Offer(%) <br />
                                        or Freebies</div>
                                    <div class="cell spcl2" align="center">Book By Date</div>
                                    <div class="cell spcl5" align="center">Activate</div>
                                </div>
                                <div class="scrollable">
                                    <?
                                    $i = 1;
                                    foreach ($this->offerTypes as $keys => $values)
                                    {

                                        if ($values['discount_type'] == 0)
                                        {
                                            $text = '%';
                                        }
                                        if ($values['discount_type'] == 1)
                                        {
                                            $text = ' Nights Free';
                                        }
                                        if ($values['discount_type'] == 2)
                                        {
                                            $text = 'Free Pool Heating';
                                        }
                                        if ($values['discount_type'] == 3)
                                        {
                                            $text = '7 Nights Free';
                                        }
                                        ?>
                                        <div class="hgroup">
                                            <div class="cell spcl1"  ><?= $values['type_name'] ?> <?= $offerArr[$values['type_name']]++ ?>
                                                <?php
                                                if ($values['discount_type'] == '1' && $values['free_nights_type'] == 'variable')
                                                {
                                                    ?>
                                                    <br>
                                                    x = 
                                                    <select <?= $disabled ?> type="text" name="discount_offer<?= $i ?>" id = "discount_offer<?= $i ?>" class = "required" >

                                                        <option value="3" <?= $values['discount_offer'] == '3' ? 'selected="selected"' : '' ?>>4</option>
                                                        <option value="4" <?= $values['discount_offer'] == '4' ? 'selected="selected"' : '' ?>>5</option>
                                                        <option value="5" <?= $values['discount_offer'] == '5' ? 'selected="selected"' : '' ?>>6</option>
                                                        <option value="6" <?= $values['discount_offer'] == '6' ? 'selected="selected"' : '' ?>>7</option>
                                                    </select><?= $text == "%" ? $text : "" ?>

                                                    <?php
                                                }
                                                ?>
                                            </div>
                                            <div class="cell spcl2 promo" id = 'promo<?= $i ?>' align="center"><?= $values['promo_code'] ?></div>
                                            <div class="cell spcl2" align="center"><input <?= $disabled ?> type="text" class = "mws-tooltip-n" name="valid_from<?= $i ?>" id="valid_from<?= $i ?>" onchange="mindate(this.value,'valid_to<?= $i ?>')" value = "<? if ($values['valid_from']) echo date('d-m-Y', strtotime($values['valid_from'])); ?>" title="<? if ($values['valid_from']) echo date('d-m-Y', strtotime($values['valid_from'])); else echo "Enter Valid From Date" ?>"/>
                                                <label id = 'error_valid_from<?= $i ?>' for="valid_from<?= $i ?>" class = "error" style="display:none;">please choose date</label>
                                            </div>
                                            <div class="cell spcl2" align="center"><input <?= $disabled ?> type="text" class = "mws-tooltip-n" name="valid_to<?= $i ?>" id="valid_to<?= $i ?>" onchange="mindateforbook(this.value,'bookby<?= $i ?>')" value="<? if ($values['valid_to']) echo date('d-m-Y', strtotime($values['valid_to'])); ?>" title="<? if ($values['valid_to']) echo date('d-m-Y', strtotime($values['valid_to'])); else echo "Enter Valid Until Date"; ?>"/>
                                                <label id = 'error_valid_to<?= $i ?>' for="valid_to<?= $i ?>" class = "error" style="display:none;">please choose date</label>
                                            </div>                                                
                                            <div class="cell spcl3" align="center"><?
                                if ($values['min_nights_type'] == '0')
                                {
                                                    ?>
                                                    <select <?= $disabled ?> name="min_stay<?= $i ?>" id = "min_stay<?= $i ?>">

                                                        <?
                                                        for ($tr = 7; $tr <= 14; $tr++)
                                                        {
                                                            if ($tr == $values['min_night'])
                                                                echo "<option selected = 'selected'>" . $tr . "</option>";
                                                            else
                                                                echo "<option >" . $tr . "</option>";
                                                        }
                                                        ?>

                                                    </select>

                                                    <?
                                                }
                                                else
                                                {
                                                    echo $values['min_nights'] . " Nights";
                                                }
                                                ?>

                                                <label id = 'error_min_stay<?= $i ?>' for="min_stay<?= $i ?>" class = "error" style="display:none;">Enter number only</label>		                       
                                            </div>                        
                                            <div class="cell spcl4" align="center"><?
                                if ($values['discount_type'] != 2 && $values['discount_type'] != 3)
                                {
                                    if ($values['discount_type'] == 1 && $values['free_nights_type'] == 'variable'):
                                                        ?>	
                                                        <div align="center" style="display:block;">
                                                            Max <input <?= $disabled ?> type="text" name="max_nights<?= $i ?>" id = "max_nights<?= $i ?>" value="<?= $values['max_night'] ?>" class = "required" /><?= $text == "%" ? $text : "" ?>
                                                        </div>
                                                        <?php
                                                    else:
                                                        ?>
                                                        <div align="center" style="display:block;">
                                                            <input <?= $disabled ?> type="text" name="discount_offer<?= $i ?>" id = "discount_offer<?= $i ?>" value="<?= $values['discount_offer'] ?>" class = "required" /><?= $text == "%" ? $text : "" ?>
                                                        </div>
                                                    <?
                                                    endif;
                                                }
                                                ?>
                                                <label id = 'error_discount_offer<?= $i ?>' for="discount_offer<?= $i ?>" class = "error" style="display:none;">Enter numbers only</label>
                                                <?= $text != "%" ? $text : "" ?>
                                            </div>                                            	
                                            <div class="cell spcl2" align="center"><input <?= $disabled ?> type="text" class = "mws-tooltip-n" name="bookby<?= $values['id'] ?>" id = "bookby<?= $i ?>" value = "<? if ($values['book_by']) echo date('d-m-Y', strtotime($values['book_by'])); ?>" title = "<? if ($values['book_by']) echo date('d-m-Y', strtotime($values['book_by'])); else echo "Enter Book By Date"; ?>"/>
                                                <label id = 'error_bookby<?= $i ?>' for="bookby<?= $i ?>" class = "error" style="display:none;">Enter proper</label>
                                            </div>                                                
                                            <div class="cell spcl5" align="center">
                                                <input type="hidden" name="spcl_offer_id<?= $i ?>" id = "spcl_offer_id<?= $i ?>" value="<?= $values['spcl_offer_id'] ?>"  />
                                                <input type="hidden" name="offer_id<?= $i ?>" id = "offer_id<?= $i ?>" value="<?= $values['id'] ?>"  />
                                                <input <?= $disabled ?> type="button" <? if ($values['activate']) echo "disabled='disabled'"; ?> class="mws-button black small mws-i-24 i-check mws-tooltip-n"  title="Click to activate this offer." onclick = 'checkvalid(<?= $i ?>)' value="+" >
                                                <input <?= $disabled ?> type="button" <? if (!$values['activate']) echo "disabled='disabled'" ?> class="mws-button black small mws-i-24 i-cross mws-tooltip-n"  title="Click to de-activate this offer." onclick = "dactive(<?= $i ?>)" value="x" >                    
                                            </div>
                                        </div>        
                                        <script type="text/javascript">
                                            $("#valid_from<?= $i ?>").datepicker({
                                                minDate: new Date(),
                                                dateFormat: "dd/mm/yy" 
                                            });	

                                            $("#valid_to<?= $i ?>").datepicker({
                                                dateFormat: "dd/mm/yy" 
                                            });

                                            var procesVal = $("#valid_to<?= $i ?>").val();

                                            if(procesVal != "")
                                            {
                                                procesVal = procesVal.split("-");

                                                if(procesVal.length < 2)
                                                    procesVal = procesVal.split("/");


                                                $("#bookby<?= $i ?>").datepicker({
                                                    dateFormat: "dd/mm/yy",
                                                    maxDate: new Date(procesVal[2],parseInt(procesVal[1])-1,procesVal[0])  
                                                });

                                            }
                                            else
                                                $("#bookby<?= $i ?>").datepicker({
                                                    dateFormat: "dd/mm/yy"
                                                });



                                        </script>
                                        <?
                                        $i++;
                                    }
                                    ?>
                                </div>
                                <br>
                                <br>
                                <div class="dataTables_wrapper">
                                    <table class="mws-table mws-datatable-server-side" style="float:left;">
                                        <thead>
                                            <tr>
                                                <th>Special Offer Type</th>
                                                <th>Promo Code</th>
                                                <th>Valid From</th>
                                                <th>Valid Until</th>
                                                <th>Minimum Night Stay</th>
                                                <th>Discount Offer</th>
                                                <th>Book By Date</th>
                                                <th>Property Code</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                    <div class="dataTables_processing" style="background-color:#bebebe !important">Processing...</div>
                                    <div class="dataTables_paginate paging_two_button">
                                        <div class="paginate_disabled_previous" id="prev" title="Previous"></div>
                                        <div class="paginate_enabled_next" id="next" title="Next"></div>
                                    </div>
                                </div>
                            </div>

                            <!-- extras panel ends -->

                            <div style="margin-top:55px;display:block;width:607px;float:left;">
                                <p>Property Notes: Please add here any special notes or comments regarding the rental rates.</p>   
                                <form name="myform" id="mws-validate" method="post" onsubmit="return checkPropertyNotes(this.value)" action="<?php echo APPLICATION_URL_ADMIN; ?>updater/submit" novalidate class="mws-form" >	
                                    <input type="hidden" name="step" value="4" />
                                    <input type="hidden" name="is_insured" id="is_insured" value="<?php echo $this->is_insured == '0' ? 'false' : 'true'; ?>">
                                    <div class="mws-form-item large">
                                        <textarea name="rental_ques" id="rental_ques"><?= $this->rental_ques ?></textarea>
                                    </div>
                                    <input type="submit"  class="mws-button red" value="Save">
                                </form>
                                <!-- Special Offers tab ends -->
                            </div>
                        </div><!-- renta rate wrapper div-->
                        <!-- step 7 ends -->

                    </div><!-- wrapper div for step 7 ends -->      
            </fieldset>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function(e){
        
       var _sEcho = 0;
       var iTotalRecords = 0;
       var recordsShowed = 0; //number of records which are on current page and on previous page
       var iTotalDisplayRecords = 0;
       //$(".dataTables_processing").show();
       //custom grid with pagination
       $.ajax({
           url:"<?php echo APPLICATION_URL_ADMIN ?>updater/getspecialoffers",
           dataType:"json",
           async:false,
           data:{'iDisplayLength':10,'iDisplayStart':0,'sEcho':0},
           success:function(data){
            _sEcho = data.sEcho;
            iTotalRecords = data.iTotalRecords;
            iTotalDisplayRecords = data.iTotalDisplayRecords;
            recordsShowed = (parseInt(_sEcho)*10)+data.iTotalDisplayRecords;
            var htmlText = "";
            for(var i in data.aaData){
                if(i%2==0)
                    htmlText += "<tr class='gradeX odd'>";
                else
                    htmlText += "<tr class='gradeX even'>";
                htmlText +=      "<td>"+data.aaData[i][0]+"</td>";
                htmlText +=      "<td>"+data.aaData[i][1]+"</td>";
                htmlText +=      "<td>"+data.aaData[i][2]+"</td>";
                htmlText +=      "<td>"+data.aaData[i][3]+"</td>";
                htmlText +=     "<td>"+data.aaData[i][4]+"</td>";
                htmlText +=     "<td>"+data.aaData[i][5]+"</td>";
                htmlText +=     "<td>"+data.aaData[i][6]+"</td>";
                htmlText +=     "<td>"+data.aaData[i][7]+"</td>";
                htmlText +=     "</tr>";
           }
                $(".dataTables_processing").hide();
                $('.mws-datatable-server-side tbody').html(htmlText);
                //enable and disable pagination next button
                if(recordsShowed < iTotalRecords){
                     $('#next').addClass('paginate_enabled_next').removeClass('paginate_disabled_next');
                }else{
                    $('#next').removeClass('paginate_enabled_next').addClass('paginate_disabled_next');
                }
               $('#prev, #next').data('page',1); 
           },
           error:function(error){
            alert("Oops! Some error occurred");
            console.log(error);
          }
       });
       
       //pagination events
       $('#next.paginate_enabled_next').live('click',function(){
           var page = $('#next').data('page');
//           console.log(page);
           $.ajax({
            url:"<?php echo APPLICATION_URL_ADMIN ?>updater/getspecialoffers",
            dataType:"json",
            async:false,
            data:{'iDisplayLength':10,'iDisplayStart':page*10,'sEcho':parseInt(page)},
            success:function(data){
                _sEcho = data.sEcho;
                iTotalRecords = data.iTotalRecords;
                iTotalDisplayRecords = data.iTotalDisplayRecords;
                recordsShowed = (parseInt(_sEcho)*10)+data.iTotalDisplayRecords;
                console.log(recordsShowed);
                var htmlText = "";
                for(var i in data.aaData){
                    if(i%2==0)
                        htmlText += "<tr class='gradeX odd'>";
                    else
                        htmlText += "<tr class='gradeX even'>";
                    
                    htmlText +=      "<td>"+data.aaData[i][0]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][1]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][2]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][3]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][4]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][5]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][6]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][7]+"</td>";
                    htmlText +=     "</tr>";
               }
                    $(".dataTables_processing").hide();
                    $('.mws-datatable-server-side tbody').html(htmlText);
//                    console.log(recordsShowed, iTotalRecords);
                    //enable and disable pagination next button
                    if(recordsShowed < iTotalRecords){
                         $('#next').addClass('paginate_enabled_next').removeClass('paginate_disabled_next');
                    }else{
                        $('#next').removeClass('paginate_enabled_next').addClass('paginate_disabled_next');
                    }

                    //enable and disable pagination previous button
                    if(recordsShowed <= 10){
                        $('#prev').removeClass('paginate_enabled_previous').addClass('paginate_disabled_previous');
                    }else{
                        $('#prev').addClass('paginate_enabled_previous').removeClass('paginate_disabled_previous');
                    }
                   $('#prev, #next').data('page',parseInt(_sEcho)+1);
            }
           });
       });
       
       $('#prev.paginate_enabled_previous').live('click',function(){
           var page = $('#next').data('page');
           page = page-1; //for previous page
           $.ajax({
            url:"<?php echo APPLICATION_URL_ADMIN ?>updater/getspecialoffers",
            dataType:"json",
            async:false,
            data:{'iDisplayLength':10,'iDisplayStart':(parseInt(page)-1)*10,'sEcho':parseInt(page)-1},
            success:function(data){
                _sEcho = data.sEcho;
                iTotalRecords = data.iTotalRecords;
                iTotalDisplayRecords = data.iTotalDisplayRecords;
                recordsShowed = (parseInt(_sEcho)*10)+data.iTotalDisplayRecords;
                var htmlText = "";
                for(var i in data.aaData){
                    if(i%2==0)
                        htmlText += "<tr class='gradeX odd'>";
                    else
                        htmlText += "<tr class='gradeX even'>";
                    
                    htmlText +=      "<td>"+data.aaData[i][0]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][1]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][2]+"</td>";
                    htmlText +=      "<td>"+data.aaData[i][3]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][4]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][5]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][6]+"</td>";
                    htmlText +=     "<td>"+data.aaData[i][7]+"</td>";
                    htmlText +=     "</tr>";
               }
                    $(".dataTables_processing").hide();
                    $('.mws-datatable-server-side tbody').html(htmlText);
//                    console.log(recordsShowed, iTotalRecords);
                    //enable and disable pagination next button
                    if(recordsShowed < iTotalRecords){
                         $('#next').addClass('paginate_enabled_next').removeClass('paginate_disabled_next');
                    }else{
                        $('#next').removeClass('paginate_enabled_next').addClass('paginate_disabled_next');
                    }

                    //enable and disable pagination previous button
                    if(recordsShowed <= 10){
                        $('#prev').removeClass('paginate_enabled_previous').addClass('paginate_disabled_previous');
                    }else{
                        $('#prev').addClass('paginate_enabled_previous').removeClass('paginate_disabled_previous');
                    }
                   $('#prev, #next').data('page',parseInt(_sEcho)+1);
            }
           });
       });
       
       
    });
    function checkPropertyNotes(value) {
        if (!value) {
            return confirm("Are you sure to overwrite the property notes value?");
        }
        return true;
    }
</script>